<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="../js/vue.js"></script>
    </head>
    <body>
        <!-- 
            1.Vue中常用的按键别名：
            回车:enter
            删除:delete
            退出：esc
            空格：space
            换行：tab
            上下左右：up/down/left/right
            2.未提供的别名可以用key值绑定，但是要加上短横线（caps-lk）
            3.系统修饰键：alt/ctrl/shift/meta
            (1)配合keydown使用，正常使用
            (2)keyup使用，按下修饰符时，再按下其他按键，然后释放其他按键，才会触发
            4.也可使用keycode指定按键（不推荐）
            5.Vue.config.keyCodes.自定义键名 = 键码（自定义按键）
         -->
        <div id="root">
            <input type="text" placeholder="点击回车出现输入值!" @keydown.enter="showInfo">
        </div>
    </body>
    <script>
        Vue.config.productionTip= false;
         new Vue({
                el:"#root",
                data:{
                    name:"小米"
                },
                methods:{
                    showInfo(e){
                        alert(e.target.value);
                    }
                }
            })
    </script>
</html>